import 'package:flutter/material.dart';
import 'package:t_flutter_test/component/layout_widget.dart';

class File04 extends StatelessWidget {
  const File04({super.key});

  @override
  Widget build(BuildContext context) {
    return LayoutWidget(
      body: Center(
        child: Container(
          width: 340,
          height: 400,
          color: Colors.lightBlueAccent,
          padding: EdgeInsets.all(10),
          child: Column(
            // 主轴对齐方式
            mainAxisAlignment: MainAxisAlignment.center,
            // 侧轴对齐方式
            crossAxisAlignment: CrossAxisAlignment.center,
            spacing: 6,
            children: [
              Image.network(
                'https://yanxuan-item.nosdn.127.net/72e734dd1a4d35ce650afebdaa600b57.png',
                width: 200,
              ),
              const Text('美妆效果嘎嘎不卡粉末面刷'),
              const Text('¥99.90'),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                crossAxisAlignment: CrossAxisAlignment.center,
                spacing: 10,
                children: [
                  Image.network(
                    'https://yanxuan-item.nosdn.127.net/afd6199278a5b8fd783bc4947960fabc.jpg',
                    width: 86,
                  ),
                  // 内容过长显示不了
                  // const Text(
                  //   '茶水分离杯耐热隔热玻璃杯,茶水分离杯耐热隔热玻璃杯,茶水分离杯耐热隔热玻璃杯,茶水分离杯耐热隔热玻璃杯'
                  // ),
                  // Expanded 组件 可以使Column、Row和Flex的所有子级扩展以填充主轴中的可用空间，从而实现弹性布局
                  const Expanded(
                    flex: 1,
                    child: Text('茶水分离杯耐热隔热玻璃杯,茶水分离杯耐热隔热玻璃杯'),
                  ),
                  const Expanded(
                    flex: 2,
                    child: Text('美妆效果嘎嘎不卡粉末面刷,美妆效果嘎嘎不卡粉末面刷'),
                  ),
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }
}
